<template>
  <div>
    <van-card @click="toHousesMsg(houseInfo.houseCode)">
      <template #thumb>
        <img
          :src="`http://liufusong.top:8080${houseInfo.houseImg}`"
          alt=""
          style="width: 80px; height: 80px; margin-top: 10px"
        />
      </template>

      <template #title>
        <h3>{{ houseInfo.title }}</h3>
      </template>

      <template #desc>
        <p style="font-size: 12px; color: darkgrey">{{ houseInfo.desc }}</p>
      </template>

      <template #tags>
        <span class="tags">{{ houseInfo.tags[0] }}</span>
      </template>

      <template #price>
        <span class="price">{{ houseInfo.price }}</span>
        <i style="color: #fa4028; font-style: normal">元/月</i>
      </template>
    </van-card>
  </div>
</template>
<script>
export default {
  name: "",
  props: {
    houseInfo: {
      type: Object,
      default: () => ({}),
    },
  },
  data() {
    return {};
  },
  components: {},
  computed: {},
  methods: {
    // 前往房间详情页
    toHousesMsg(id) {
      this.$router.push({
        path: "/detail/housemessage",
        query: {
          id,
        },
      });
    },
  },
};
</script>
<style scoped>
.tags {
  color: #42bfce;
  background-color: #e1f5f8;
}
.price {
  font-size: 15px;
  font-weight: bold;
  color: #fa4028;
}
</style>
